import React from 'react';
import List2 from './List2';
import List3 from './List3';
import ImmerDemo from './ImmerDemo';
import StateDemo1 from './StateDemo1';
import useMouse from './hooks/useMouse';
import StyledComponentsDemo from './StyledComponentsDemo';
import EmotionDemo from './EmotionDemo';
function App() {
  const position = useMouse();
  console.log(position);
  return (
    <>
      {/* <List2 /> */}
      {/* <ImmerDemo /> */}
      {/* <StateDemo1 /> */}
      {/* <List2></List2> */}
      <p>{`当前鼠标位置: ${position.x}, ${position.y}`}</p>
      <List3 />
      <StyledComponentsDemo />
      <EmotionDemo />
    </>
  );
}

export default React.memo(App);
